<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>订单</title>
	<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0, maximum-scale=1.0">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="format-detection" content="telephone=no">
	<link type="text/css" rel="stylesheet" media="screen" href="__FONT__/css/mrs.css"/>
    <link type="text/css" rel="stylesheet" media="screen" href="__FONT__/css/media.css"/>
    
    <style>
    	*{
		    margin: 0;
		    padding:0;
		    -webkit-tap-highlight-color:rgba(0,0,0,0);
		    -webkit-text-size-adjust:none;
		}
		html{
		    font-size:10px;
		}
		body{
		    background-color: #f7f7f9;
		    font-size: 1.2em;
		}
		.inner{margin-bottom: 0px;}
    </style>
</head>
<body style="background:#f7f7f9;">
<include file="Public/customHeader" title="订单" url="{:U('/User/index')}"/>
	<div class="lists">
	<if condition="$list">
		<foreach name="list" item="order">
    		<div class="mrs_order my_order" data-id="{$order.id}" data-redirect="rel" data-url="{:U('/Order/orderInfo/id/'.$order['id'])}">
           <h1>{$order.beauty_parlor.name}
           		<eq name="order.status" value="2">
                	<label>待付款</label>
                	<label class="hide" style="display:none;">已取消</label>
                </eq>
                <eq name="order.status" value="1">
                <label>待消费</label>
                </eq>
                <eq name="order.status" value="5">
                <label>已取消</label>
                </eq>
                <eq name="order.status" value="4">
                <label>已完成</label>
                </eq>
                <eq name="order.status" value="3">
                <label>服务中</label>
                </eq>
          </h1>
          <h2>项目：<span>{$order.service_name}</span><label>￥{$order.price}</label></h2>
          <div class="mrs_self">
             <if condition="$order['beautician']['profile_img']">
		     <img src="__UPLOADS__/Profile/{$order.beautician.profile_img}">
		     <else />
		     <img src="__FONT__/images/defaultProfile.png">
		     </if>
             <dd>
               <strong>美&nbsp;&nbsp;容&nbsp;&nbsp;师：<span>{$order.beautician.name}</span></strong>
               <strong>服务时间：<span>{$order.service_time}分钟</span></strong>
             </dd>
          </div>
          <div class="mrs_infor myorderhack">
               <strong>用户姓名：<span>{$user.username}</span><label>{$user.mobile}</label></strong>
               <strong>预约时间：<span>{$order.order_time|date="Y-m-d H:i",###}</span></strong>
               <strong>服务地址：<span>{$order.service_address}</span></strong>
          </div>
          <div class="mrs_do dohack clear">
             <ul>
             	<eq name="order.status" value="2">
                <li><a href="javascript:void(0);" class="channel_btn cancelOrder">取消订单</a></li>
                <li><a href="{:U('Order/rePay/id/'.$order ['id'])}" class="mrs_btn">去支付</a></li>
                <li class="hide" style="display:none;"><a href="" class="channel deleteOrder" ></a></li>
                <li class="hide" style="display:none;"><a href="{:U('ServiceItem/reOrder/id/'.$order['id'])}" class="mrs_btn" >再次预约</a></li>
                 </eq>
                 <eq name="order.status" value="1">
                 <li></li>
                 <li><a href="{:U('/Order/orderInfo/id/'.$order['id'])}" class="mrs_btn">查看订单</a></li>
                 </eq>
                 <eq name="order.status" value="5">
                 <li><a href="" class="channel deleteOrder"></a></li>
                 <li><a href="{:U('ServiceItem/reOrder/id/'.$order['id'])}" class="mrs_btn">再次预约</a></li>
                 </eq>
                 <eq name="order.status" value="4">
                 <li><a href="{:U('ServiceItem/reOrder/id/'.$order['id'])}" class="channel_btn">再次预约</a></li>
                 <li><a href="{:U('Comments/comment/id/'.$order['id'])}" class="mrs_btn"><if condition="$order['iscomment'] eq 1">查看回复<else />去评价</if></a></li>
                 </eq>
              </ul>
           </div>         
		</div>
    </foreach>
<else/>
	<div class="no_bank"><h1>美滴滴</h1><p>没有订单~</p></div>
</if>
</div>

<script src="__FONT__/js/zepto.min.js"></script>
<script src="__FONT__/js/dropload.min.js"></script>
<script type="text/javascript" src="__FONT__/js/mustache.js"></script>

<script>
var hasMore = false,
	nextPage = '{$nextPage}',
	itemTemp = '<div class="mrs_order my_order" data-id="{{id}}" data-redirect="rel" data-url="{:U(\'/Order/orderInfo\')}?id={{id}}">'
       +'<h1>{{beauty_parlor.name}}'
       +'{{#notPay}}'
       +'<label>待付款</label>'
       +'<label class="hide" style="display:none;">已取消</label>'
       +'{{/notPay}}'
       +'{{#hasPay}}'
       +'<label>待消费</label>'
       +'{{/hasPay}}'
       +'{{#hasCancel}}'
       +'<label>已取消</label>'
       +'{{/hasCancel}}'
       +'{{#hasUse}}'
       +'<label>已完成</label>'
       +'{{/hasUse}}'
       +'</h1>'
       +'<h2>项目：<span>{{service_name}}</span><label>￥{{price}}</label></h2>'
       +'<div class="mrs_self">'
       +'<img src="{{#hasBeauticianProfile}}__UPLOADS__/Profile/{{beautician.profile_img}}{{/hasBeauticianProfile}}{{^hasBeauticianProfile}}__FONT__/images/defaultProfile.png{{/hasBeauticianProfile}}">'
       +'<dd>'
       +'<strong>美&nbsp;&nbsp;容&nbsp;&nbsp;师：<span>{{beautician.name}}</span></strong>'
       +'<strong>服务时间：<span>{{service_time}}分钟</span></strong>'
       +'</dd>'
       +'</div>'
       +'<div class="mrs_infor">'
       +'<strong>用户姓名：<span>{{user.username}}</span><label>{{user.mobile}}</label></strong>'
       +'<strong>预约时间：<span>{{orderTime}}</span></strong>'
       +'<strong>服务地址：<span>{{service_address}}</span></strong>'
       +'</div>'
       +'<div class="mrs_do dohack clear">'
       +'<ul>'
       +'{{#notPay}}'
       +'<li><a href="javascript:void(0);" class="channel_btn cancelOrder">取消订单</a></li>'
       +'<li><a href="{:U(\'Order/rePay\')}?id={{id}}" class="mrs_btn">去支付</a></li>'
       +'<li class="hide" style="display:none;"><a href="" class="channel deleteOrder" ></a></li>'
       +'<li class="hide" style="display:none;"><a href="{:U(\'ServiceItem/reOrder\')}?id={{id}}" class="mrs_btn" >再次预约</a></li>'
       +'{{/notPay}}'
       +'{{#hasPay}}'
       +'<li></li>'
       +'<li><a href="{:U(\'/Order/orderInfo\')}?id={{id}}" class="mrs_btn">查看订单</a></li>'
       +'{{/hasPay}}'
       +'{{#hasCancel}}'
       +'<li><a href="" class="channel deleteOrder"></a></li>'
       +'<li><a href="{:U(\'ServiceItem/reOrder\')}?id={{id}}" class="mrs_btn">再次预约</a></li>'
       +'{{/hasCancel}}'
       +'{{#hasUse}}'
       +'<li><a href="{:U(\'ServiceItem/reOrder\')}?id={{id}}" class="channel_btn">再次预约</a></li>'
       +'<li><a href="{:U(\'Comments/comment\')}?id={{id}}" class="mrs_btn">{{#hasComment}}查看回复{{/hasComment}}{{^hasComment}}去评价{{/hasComment}}</a></li>'
       +'{{/hasUse}}'
       +'</ul>'
       +'</div>'       
       +'</div>';
       
       
  		
  	var loadMorePromise, loading = false;
	function loadMore() {
 		if (!hasMore || loading) {
	   		return false;
	 	}
    	   	
  	  	if (loadMorePromise && loadMorePromise.state == 'pending') {
  	  		return false;
  	  	}
  	  	loading = true;
   	  	loadMorePromise = $.ajax({
	            type: 'GET',
	            url: nextPage,
	            dataType: 'json',
	            success: function(result){
	            	if (result.status == 1) {
	            		var itemHtml = '';
	            		if (!$.isEmptyObject(result.data)) {
	            			data = result.data;
	            			for(var i in data){
	            				var order = data [i];
	            				
	            				order.user = result.user;
	            				order.hasBeauticianProfile = function () {
	            					return $.trim(order.beautician.profile_img) != '';
	            				}
	            				
	            				if (order.status == '2') {
	            					order.notPay = true;
	            				} else if (order.status == '1'){
	            					order.hasPay = true;	
	            				} else if (order.status == '5') {
	            					order.hasCancel = true;
	            				} else if (order.status == '4') {
	            					order.hasUse = true;
	            				}
	            				
	            				order.hasComment =  order.iscomment == 1;
	            				itemHtml += Mustache.render(itemTemp, order);
				      		}
	            		}
		               
	            		itemHtmlObj = $(itemHtml);
		                // 为了测试，延迟1秒加载
		                setTimeout(function(){
		                    $('.lists').append(itemHtmlObj);
		                    itemHtmlObj.each(function (i, o) {
		                    	ItemEventBind($(o));
		                    });
		                },1000);
		                
		                if (result.hasMore) {
		                	nextPage = result.nextPage;
		                } else {
		                	hasMore = false;
		                }
	            	}
	            	
	            	loading = false;
	            },
	            error: function(xhr, type){
	            	loading = false;
	                me.resetload();
	            }
	        });
       }
       
	$(function () {
		$(window).scroll(function() {
   			if ($(window).scrollTop() >= $(document).height() - $(window).height()-100) {
   				loadMore();
   			}
   		});
	})
	</script>
	<if condition="$hasMore">
   	<script>hasMore = true;</script>
    </if>
    <script>
    var cancelOrder,
		deleteOrder;
    
  	//功能：阻止事件默认行为
	function stopDefault( e ) {
	     // 阻止默认浏览器动作(W3C)
	     if ( e && e.preventDefault ) {
	         e.preventDefault();
	     } else {
	        // IE中阻止函数器默认动作的方式
	        window.event.returnValue = false;
	    }
	    return false;
	}
  
    function ItemEventBind(item) {
    	$(item).click(function () {
    		var url = $(this).attr('data-url');
			window.location.href = url;
    	});
    	
    	$(item).find('.cancelOrder').click(function (e) {
    		if (confirm('确定要取消该订单吗？')) {
	    		var _this = $(this),
	    			wrap = $(_this).parents('div.my_order'),
	    			id = $(wrap).attr('data-id');
	    		
	    		if (cancelOrder && cancelOrder.state() == 'pending') {
	    			return false;
	    		}
	    		
	    		cancelOrder = $.ajax({
	    			url: '{:U("Order/cancel")}',
	    			data:{id:id},
	    			dataType: 'json',
	    			success: function (result) {
						if (result.status) {
							$(wrap).find('h1 label.hide').show().prev().hide();
				    		$(_this).parents('li').siblings('.hide').show().siblings().not('.hide').remove();
						} else {
							alert(result.message);
							return false;
						}
					},
	    			error: function () {
	    				alert('请求中断，稍候再试');
	    			}
	    		});
    		}
    		return false;
    	});
    	
    	$(item).find('.deleteOrder').click(function (e) {
    		if (confirm('确定要删除该订单吗？')) {

        		var _this = $(this),
        			wrap = $(_this).parents('div.my_order'),
        			id = $(wrap).attr('data-id');
        		
        		if (deleteOrder && deleteOrder.state() == 'pending') {
        			return false;
        		}
        		
        		deleteOrder = $.ajax({
        			url: '{:U("Order/delete")}',
        			data:{id:id},
        			dataType: 'json',
        			success: function (result) {
    					if (result.status) {
    						wrap.remove();
    					} else {
    						alert(result.message);
    						return false;
    					}
    				},
        			error: function () {
        				alert('请求中断，稍候再试');
        			}
        		});
    		}
    		return false;
    	});
    }
    
//     function checkNews() {
//     	$.ajax({
//     		url: '{:U("checkNews")}',
//     		data: {id: },
//     		dataType: 'json'
//     	});
//     }
    $(function () {
    	$('.mrs_order').each(function (i, o) {
    		ItemEventBind($(o));
    	});
    })
    </script>
</body>
</html>